<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:thSys="">
<div th:replace="admin/module/macros :: head('新建文章')"></div>
<body class="app sidebar-mini rtl">
	<main class="app-content">
	<div th:replace="admin/module/macros :: header"></div>
	<div th:replace="admin/module/macros :: sidebar"></div>
	<div class="app-title">
		<div>
			<h1>
				<i class="fa fa-book"></i>新建页面
			</h1>
		</div>
		<ul class="app-breadcrumb breadcrumb">
			<li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
			<li class="breadcrumb-item"><a href="/admin/article">页面管理</a></li>
			<li class="breadcrumb-item">新建页面</li>
		</ul>
	</div>
	<form id="articleFrom" class="form-horizontal">
		<input type="hidden" id="articleContent" name="articleContent">
		<input type="hidden" id="articleContentMd" name="articleContentMd">
		<input type="hidden" id="articleStatus" name="articleStatus">
		<input type="hidden" id="articlePost" name="articlePost" value="post">
		<div class="row">
			<div class="col-md-8">
				<div class="tile">
					<div class="table-responsive">
						<div class="form-group">
							<input class="form-control" name="articleTitle" id="articleTitle" type="text"
								placeholder="输入页面标题">
						</div>
						<div class="form-group">
							<input class="form-control" name="articleUrl" id="articleUrl" type="text"
								placeholder="为空则后台生成时间戳链接">
						</div>
						<div class="form-group">
							<textarea  name="contentEditor"  id="contentEditor" class="form-control"></textarea>
						</div>
					</div>
				</div>
			</div>
			<div class="col-md-4">
				<div class="tile">
					<div class="form-group row">
						<label class="control-label col-md-3">页面类型:</label>
						<div class="col-md-9">
							<select name="articleType" class="form-control">
								<optgroup label="请选择">
									<option value="0">原创</option>
									<option value="1">转载</option>
								</optgroup>
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-md-3">开启评论:</label>
						<div class="col-md-9">
							<select name="articleComment" class="form-control">
								<optgroup label="请选择">
									<option value="0">是</option>
									<option value="1">否</option>
								</optgroup>
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-md-3">页面分类:</label>
						<div class="col-md-9">
							<select name="categorys" class="form-control" id="categorySelect"
								multiple="">
								<optgroup label="点击选择，可多选">
									<option th:each="category:${categorys}"
										th:value="${category.categoryId}"
										th:text="${category.categoryName}"></option>
								</optgroup>
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-md-3">页面标签:</label>
						<div class="col-md-9">
							<select name="tags" class="form-control" id="tagSelect"
								multiple="">
								<optgroup label="点击选择，可多选">
									<option th:each="tag:${tags}" th:value="${tag.tagId}"
										th:text="${tag.tagName}"></option>
								</optgroup>
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-md-3">页面略缩图：</label>
						<div class="col-md-9">
							<div class="input-group">
								<input type="text" class="form-control" id="articleThumbnail"
									name="articleThumbnail" readonly="readonly"> <span class="input-group-btn">
									<button class="btn btn-default " type="button"
										th:onclick="'javascript:openChoice(\''+articleThumbnail+'\')'">选择</button>
								</span>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label class="control-label col-md-3">页面摘要:</label>
						<div class="col-md-9">
							<textarea class="form-control" name="articleSummary" placeholder="如果为空则自动生成摘要" rows="3"></textarea>
						</div>
					</div>
					<div class="tile-footer">
						<button class="btn btn-sm btn-outline-secondary" onclick="save(1)"
							type="button">保存草稿</button>
						<button class="btn btn-sm btn-outline-primary pull-right" onclick="save(0)" type="button">发布页面</button>
					</div>
				</div>
			</div>
		</div>
	</form>
	</main>
	<div th:replace="admin/module/macros :: comm"></div>
	<script src="/plugins/layer/layer.js"></script>
	<script
		src="/plugins/simplemde/simplemde.min.js"></script>
	<script
		src="/plugins/simplemde/highlight.min.js"></script>
	<script
		src="/plugins/simplemde/select2.min.js"></script>
	<script src="/plugins/pinyinjs/pinyin_dict_notone.js"></script>	
	<script src="/plugins/pinyinjs/pinyinUtil.js"></script>	
	<script src="/plugins/inline-attachment/codemirror-4.inline-attachment.min.js"></script>
	<script type="text/javascript">
 	//选择略缩图
	function openChoice(id){
		layer.open({
			type : 2,
			title : '所有附件',
			anim : 2,
			area : [ '90%', '90%' ],
			maxmin : true,
			shadeClose: true,
			content : "/admin/profile/openChoice/" + id
		});
	}
 	//保存文章
 	function save(articleStatus){
		editor.sync();
		var contentMd=document.getElementById('contentEditor').value;
		if(contentMd!=""){
			$("#articleContentMd").val(contentMd);
			$("#articleContent").val(contentMd);
 			$("#articleStatus").val(articleStatus);
			var obj=$("#articleFrom").serialize();
 			 $.ajax({
 					type : "post",
 					url : "/admin/article/new/save",
 					data : obj,
 					async: false,
 					dataType : "json",
 					success : function(data){
 						if(data.flag==true){
 							//这个不管用，我也不知道为啥
 							//simplemde.clearAutosavedValue();
 							//simplemde.toTextArea();
 							//simplemde = null;
 	 					 	$.toast({
 	 	                         text: data.msg,
 	 	                         heading: '提示',
 	 	                         icon: 'success',
 	 	                         showHideTransition: 'fade',
 	 	                         allowToastClose: true,
 	 	                         hideAfter: 1000,
 	 	                         stack: 1,
 	 	                         position: 'top-center',
 	 	                         textAlign: 'left',
 	 	                         loader: true,
 	 	                         loaderBg: '#ffffff',
 	 	                         afterHidden: function () {
 	 	                        	 window.location.href = "/admin/article"; 
 	 	                         }
 	 	                     }); 
 						}else{
 							showMsg(data.msg,"error","3000");
 						}
 					}
 				}); 
 		}else{
            showMsg("请输入页面内容！","error","3000");
        }
 	}
    $('#categorySelect').select2();
	$('#tagSelect').select2();
   </script>
	<link rel="stylesheet" src="/yiyuan/kindeditor/themes/default/default.css" />
	<link rel="stylesheet" src="/yiyuan/kindeditor/plugins/code/prettify.css" />
	<script charset="utf-8" src="/yiyuan/kindeditor/kindeditor-all.js"></script>
	<script charset="utf-8" src="/yiyuan/kindeditor/lang/zh-CN.js"></script>
	<script>
		var editor;
		KindEditor.ready(function(K) {
			editor = K.create('textarea[name="contentEditor"]', {
				height : "300px",
				allowPreviewEmoticons : false,
				uploadJson : '/document/upload.html',
				allowImageUpload : false,
				pasteType : 1,      //设置能否粘贴
				items : [
					'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
					'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
					'insertunorderedlist', '|', 'emoticons', 'image', 'link','fullscreen']
			});
		});
	</script>
</body>
</html>